<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>宅修侠-平台保障</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
		<link rel="stylesheet" type="text/css" href="css/public.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<style type="text/css">
		.xminfo{
			margin-top: 20px;
			padding: 0 50px;
			box-sizing: border-box;
		}
		.xminfo-list li{
			margin: 20px 0 0 20px;
			border-radius: 16px;
			border: 1px solid #1BA7EC;
			padding: 20px;
			box-sizing: border-box;
			float: left;
			width: 530px;
		}
		.xminfo-list-img{
			width: 400px;
			height: 200px;
			text-align: center;
		}
		.xminfo-list-title{
			line-height: 40px;
			font-size: 16px;
			text-align: left;
			color: #333;
		}
		.xminfo-list-bot{
			font-size: 16px;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
		.xminfo-list-bot i:first-of-type{
			color: red;
		}
		.xminfo-list-bot i:last-of-type{
			padding: 5px 30px;
			color: #fff;
			cursor: pointer;
			background-color: #1BA7EC;
			border-radius: 20px;
		}
	</style>
	<body>
		<!-- header-all -->
		<header class="header">
			<div class="header-top">
				<div class="header-top-logo">
					<div class="header-top-logo-img">
						<img src="image/logo.png" >
					</div>
					<div class="header-top-logo-address">
						重庆<img src="image/address.png" >
					</div>
				</div>
				<div class="header-top-ewm">
					<div class="header-top-ewm-img">
						<img src="image/ewm.png" >
					</div>
					<div class="header-top-ewm-text">
						<p>扫描二维码，关注微信公众号,</p>
						<p>更多惊喜等你来。</p>
					</div>
				</div>
				<div class="header-top-right">
					<div class="header-top-right-top">
						<p>工程师入驻</p>
						<p>商户入驻</p>
					</div>
					<div class="header-top-right-number">
						全国热线：4000-023-114
					</div>
				</div>
			</div>
			<div class="header-nav">
				<ul>
					<li>首页</li>
					<li>服务项目</li>
					<li>翻新案例</li>
					<li>平台咨询</li>
					<li>翻新知识</li>
					<li class="tab-active">平台保障</li>
					<li>关于我们</li>
				</ul>
			</div>
		</header>
		
		<div class="content">
			<!-- swiper -->
			<div class="swiper">
				<!-- Swiper -->
			  <div class="swiper-container">
				<div class="swiper-wrapper">
				  <div class="swiper-slide item_1"></div>
				  <div class="swiper-slide item_2"></div>
				  <div class="swiper-slide item_3"></div>
				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination"></div>
				<!-- Add Arrows -->
				<div class="swiper-button-next swiper-button-white"></div>
				<div class="swiper-button-prev swiper-button-white"></div>
			  </div>
			  
			  <!-- 机器人 -->
			  <div class="jqr">
			  	<img src="image/index/jq.png" >
			  </div>
			</div>
			
			<!-- 8大优势 -->
			<div class="zxx-title">
				<div class="fxal-nav">
					<div class="fxal-nav-list">
						<p class="fxal-nav-kj">空间</p>
						<ul class="fxal-nav-dl clearfix">
							<li class="fxal-act">不限</li>
							<li>家电清洗</li>
							<li>家电维修</li>
							<li>水电卫浴</li>
							<li>门窗家具</li>
							<li>家电清洗</li>
							<li>家电维修</li>
							<li>水电卫浴</li>
							<li>门窗家具</li>
							<li>家电清洗</li>
						</ul>
					</div>
				</div>
				<div class="xminfo">
					<ul class="xminfo-list clearfix">
						<li>
							<p class="xminfo-list-img"><img src="image/kt.png" ></p>
							<p class="xminfo-list-title">空调</p>
							<p class="xminfo-list-bot"><i>￥888</i><i>立即预约</i></p>
						</li>
						<li>
							<p class="xminfo-list-img"><img src="image/kt.png" ></p>
							<p class="xminfo-list-title">空调</p>
							<p class="xminfo-list-bot"><i>￥888</i><i>立即预约</i></p>
						</li>
						<li>
							<p class="xminfo-list-img"><img src="image/kt.png" ></p>
							<p class="xminfo-list-title">空调</p>
							<p class="xminfo-list-bot"><i>￥888</i><i>立即预约</i></p>
						</li>
						<li>
							<p class="xminfo-list-img"><img src="image/kt.png" ></p>
							<p class="xminfo-list-title">空调</p>
							<p class="xminfo-list-bot"><i>￥888</i><i>立即预约</i></p>
						</li>
						<li>
							<p class="xminfo-list-img"><img src="image/kt.png" ></p>
							<p class="xminfo-list-title">空调</p>
							<p class="xminfo-list-bot"><i>￥888</i><i>立即预约</i></p>
						</li>
					</ul>
				</div>
			</div>
			
			<!-- 分页器 -->
			<div class="fxal-fy">
				<div class="fxal-fy-number">
					<ul class="fxal-fy-number-lsit clearfix">
						<li class="fxal-act">1</li>
						<li>2</li>
						<li>3</li>
						<li>4</li>
						<li>5</li>
						<li>6</li>
					</ul>
				</div>
				<div class="fxal-fy-right">
					<img src="image/fxal_right.png" >
				</div>
				<div class="fxal-fy-tx">
					至
					<input type="" name="" id="" value="" />
					页
				</div>
				<div class="fxal-fy-go">
					GO
				</div>
			</div>
		</div>
		
		
		<!-- 底部 -->
		<footer class="footer">
			<div class="footer-first">
				<div class="footer-first-img">
					<img src="image/ewm.png" >
				</div>
				<div class="footer-first-text">
					<p>扫描二维码，关注微信公众号,</p>
					<p>更多惊喜等你来。</p>
				</div>
			</div>
			<div class="footer-info">
				<p>友情链接：XXXXXXXXXXXXX</p>
				<p>联系电话：12345678900</p>
				<p>公司地址：XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p>
			</div>
			<div class="footer-bq">
				XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX版权所有
			</div>
		</footer>
		
		<script src="js/jquer-1.8.9.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
		<script>
			
			
			$(".fxal-nav-dl li").click(function(){
				$(this).addClass('fxal-act').siblings().removeClass('fxal-act');
			})
			$(".fxal-fy-number-lsit li").click(function(){
				$(this).addClass('fxal-act').siblings().removeClass('fxal-act');
			})
	  </script>
	</body>
</html>
